<template>
  <div>
    <el-form
        ref="form"
        :model="articleContent"
        :rules="rules"
        label-width="80px"
    >
      <el-form-item label="活动名称" v-if="options.activityName">
        <el-input v-model="options.activityName" disabled></el-input>
      </el-form-item>
      <el-form-item label="简报名称" prop="activitycontentTitle">
        <el-input v-model="articleContent.activitycontentTitle"></el-input>
      </el-form-item>
      <el-form-item label="简报内容">
        <editor
            ref="editor"
            :content="articleContent.activitycontentDisc"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit('form')">立即发布</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  mounted () {
    const {
      activityId,
      activityName,
    } = (this.$route.params);

    this.articleContent.activityId = activityId ?? null;
    this.options.activityName = activityName ?? null;

  },
  data () {
    return {
      articleContent: {
        activityId: "",
        activitycontentTitle: "",
        activitycontentDisc: "",
      },
      options: {
        activityName: null,
      },
      rules: {
        activitycontentTitle: [
          {
            required: true,
            message: "请输入风采标题",
            trigger: "blur",
          },
        ],
      },
    };
  },
  methods: {
    // 上传文件
    async handleUpload (file) {
      const params = new FormData();
      params.append("files", file.file);
      const res = await this.$http.uploadFile(params);
      if (res.code !== 200) return this.$message.error(res.message);
      this.realFileUrl.push(res.files[0]);
    },
    // 立即发布
    onSubmit (formName) {
      this.$refs[formName]?.validate(async (valid) => {
        if (valid) {
          let form = this.articleContent;
          //调用编辑器的事件发起发布
          form.activitycontentDatetime = this.$moment().format("YYYY-MM-DD");
          await this.$refs.editor.toSubmit(form);
        }
      });
    },
  },
  components: {
    "editor": () => import("../../components/editor"),
  },

};
</script>
